<template>
  <publicList
      ref="publicListRef"
      @toolChange="toolChange"
      :toolList="toolList.toolList"
      :paramsList="toolList.paramsList"
      :selectNums="ids.length"
      :queryParams="toolList.queryParams"
      @searchSubmit="searchSubmit"
      :total="total"
      @paginate="handlePaginateFun"
      :tableData="tableDataList"
      :columns="toolList.tableItem"
      :loading="loading"
      rowKey="uuid"
      @handleSelectionChange="handleSelectionChange"
  >
    <template v-slot:tableHead="head">
      {{ head.item.label }}
    </template>
    <template v-slot:tableColumn="scope">
       <template v-if="scope.scope.prop=='approveState'">
        {{ toolList.orderStatus[scope.scope.row.approveState] }}
      </template>
      <template v-else-if="scope.scope.prop=='orderType'">
        {{ toolList.orderTypeObj[scope.scope.row.orderType] }}
      </template>
      <template v-else>{{ scope.scope.row[scope.scope.prop] }}</template>
    </template>
  </publicList>
</template>

<script>
import {ref, reactive, computed, getCurrentInstance, watch, onMounted} from "vue"
import {useRouter} from "vue-router"
import {
  getBacklogList,
} from "@/api/customer"
import {tableMixin} from "@/mixins/tableMixin.js"

export default {
  name: "backlog",
  setup() {
    const {proxy} = getCurrentInstance()
    const router = useRouter();
    const toolList = reactive({
      toolList: [
        {id: "1", label: "刷新", ismul: false},
      ],
      paramsList: [
        {label: '任务日期', props: 'createTime', type: '4'},
        {
          label: '单据类型',
          props: 'orderType',
          type: '2',
          queryList: [
            {label: '销售订单', value: '1'},
            {label: '采购付款', value: '2'},
            {label: '销售退款', value: '3'},
            {label: '销售佣金', value: '4'},
            {label: '采购订单', value: '5'},
            {label: '采购退货', value: '7'},
            {label: '采购佣金', value: '8'},
            {label: '销售退货', value: '9'},
            {label: '盘盈单', value: '10'},
            {label: '盘亏单', value: '11'},
            {label: '客户', value: '20'},
            {label: '供应商', value: '21'}
          ]
        },
        {
          label: '单据状态',
          props: 'approveStates',
          type: '3',
          queryList: [
            {label: '待审核', value: '0'},
            {label: '已审核', value: '1'},
            {label: '驳回', value: '2'}
          ]
        },
        {
          label: '发起人',
          props: 'orderUser',
          type: '1',
        },
        {
          label: '处理人',
          props: 'logisticsName',
          type: '1',
        }
      ],
      queryParams: {
        // 每页多少数据
        pageSize: 10,
        // 当前页
        pageNum: 1,
        orderType: [],
        approveStates: '0',
        orderUser: '',
        logisticsName: '',
        createTime: null,
        startTime: '',
        endTime: '',
        searchValue: ''
      },
      tableItem: [
        {label: '单据编码', prop: 'orderNum', align: 'left', width: ''},
        {label: '单据类型', prop: 'orderType', align: 'left', width: ''},
        {label: '状态', prop: 'approveState', align: 'left', width: ''},
        {label: '任务日期', prop: 'createTime', align: 'left', width: ''},

        {label: '发起人', prop: 'orderUser', align: 'left', width: ''},

        {label: '处理人', prop: 'approveUser', align: 'left', 'mustSelect': true, width: ''}

      ],
      orderStatus: {0: '待审核', 1: '已审核', 2: '驳回'},
      orderTypeObj: {
        1: '销售订单',
        2: '采购付款',
        3: '销售退款',
        4: '销售佣金',
        5: '采购订单(SO)',
        6: '采购订单',
        7: '采购退货',
        8: '采购佣金',
        9: '销售退货',
        10: '盘盈单',
        11: '盘亏单',
        // 12: '财务付款申请单',
        20: '客户',
        21: '供应商',
        22: '客户合并',
        23: '供应商合并',
        24: '老系统销售退换货',
        25: '老系统采购退换货',
      },
    });
    const searchTime = ref({})
    let {
      ids,
      loading,
      publicListRef,
      getTableData,
      total,
      tableDataList,
      searchSubmit,
      handlePaginateFun,
      handleSelectionChange
    } = tableMixin({
      getListApi: getBacklogList,
      queryParams:toolList.queryParams,
      searchTime,
      getListCallBack(res) {
        total.value = res.total;
        tableDataList.value = res.rows;
      },
    })

    const toolChange = (e) => {
      if (e == '1') {
        getTableData();
      }
    }
    onMounted(() => {
      getTableData()
    })
    return {
      toolList,
      total,
      publicListRef,
      tableDataList,
      loading,
      ids,
      handlePaginateFun,
      toolChange,
      handleSelectionChange,
      searchSubmit
    }
  },
  components: {},
  data() {
    return {}
  },
  created() {
  },
  mounted() {
  },
  methods: {},
  computed: {},
  watch: {},
  beforeDestroy() {
  },
  destroyed() {
  }
}
</script>

<style scoped lang="scss">

</style>